<template>
	<div class="updatehp">
		<div class="pic"><img :src="`http://127.0.0.1/api/public/showimg/${arr.picture}`" />
			<el-upload :multipe="false" :auto-upload="false" :file-list="list" :on-change="handleChange"
				list-type="picture" action="uploadAction" accept="image/jpg,image/jpeg">
				<h3>点击修改图片</h3>
			</el-upload>
			<hr>
		</div>
		<div class="in">
			<el-form :model="arr" ref="arr" label-width="100px" class="demo-ruleForm">
				<el-form-item label="优先级-整数" prop="hot">
					<el-input v-model="arr.hot"></el-input>
					</el-select>
				</el-form-item>
				<el-form-item label="描述" prop="memo">
					<el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="arr.memo">
					</el-input>
				</el-form-item>
				<el-button type="primary" @click="submit('arr')">立即修改</el-button>
			</el-form>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				arr: {
					id: 0,
					type: 0,
					hot: 0,
					memo: ''
				},
				list: [],
			}
		},
		methods: {
			handleChange(file, list) {
				this.list = list;
			},
			submit() {
				let formData = new FormData();
				if (this.list.length > 0 && this.list[0].raw != null) {
					formData.append("pic", this.list[0].raw);
				}
				formData.append("id", this.arr.id);
				formData.append("memo", this.arr.memo);
				formData.append("picture", this.arr.picture);
				formData.append("hot", this.arr.hot);
				formData.append("type", this.arr.type);
				var that = this;
				this.$postf("/api/adm/hot/add", formData).then(resp => {
					this.$message.error("修改成功");
					console.log(resp.data.data);
					if (resp.data.code == 200) {
						this.arr = resp.data.data;
						console.log(this.arr);
					}
				})
			}
		},
		mounted() {
			this.arr = this.$route.query.arr;
		}
	}
</script>

<style scoped>
	.updatehp {
		width: 85%;
	}

	.updatehp .pic img {
		width: 20%;
	}
</style>
